<div style="margin-bottom: 8px">
  <button nz-button nzType="primary" (click)="addCategory()">添加分类</button>
</div>
<!--表格-->
<nz-table #basicTable [nzData]="listOfData.records"
          nzSize="small"
          nzShowSizeChanger
          nzShowPagination="false"
          [nzFrontPagination]="false"
>
  <thead>
  <tr>
    <th nzAlign="center">名称</th>
    <th nzAlign="center" nzWidth="400px">操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of basicTable.data;let index=index;">
    <td nzAlign="center">{{ data['classifyName'] }}</td>
    <td nzAlign="center">
      <a (click)="editCategory(data)">编辑</a>
      <a nzPopconfirmPlacement="top" [attr.statusColor]="0"
         nz-popconfirm
         nzPopconfirmTitle="确认要删除?"
         nzOkText="确认"
         nzCancelText="取消"
         (nzOnConfirm)="deleteCategory(data['id'])"
      >删除</a>
    </td>
  </tr>
  </tbody>
</nz-table>


<!--分类管理-->
<nz-modal
  [(nzVisible)]="addCategoryModal.visible"
  nzTitle="分类管理"
  (nzOnCancel)="hideAddCategoryModal()">
  <div *nzModalContent>
    <div class="rowItem">
      <label for="addCategoryModalName"><span>*</span>名称</label>
      <input id="addCategoryModalName" nz-input placeholder="请输入分类名称" [(ngModel)]="addCategoryModal.name"/>
    </div>
  </div>
  <div *nzModalFooter>
    <button nz-button nzType="default" (click)="hideAddCategoryModal()">取消</button>
    <button nz-button nzType="primary" (click)="saveCategory()">确认</button>
  </div>
</nz-modal>
